﻿
<!-- 
	描述：新闻列表
	作者：吴博
	时间：2017、5、7

-->

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/mui.css"/>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <h1 class="mui-title">新闻内容</h1>
    </header>
    <!--下拉刷新容器-->
    <div id="refreshContainer" class="mui-content mui-scroll-wrapper">
      <div class="mui-scroll">
        <!--数据列表-->
	       <ul id="list" class="mui-table-view">
	            
	               
	       </ul>
      </div>
   </div>
  <script id="tpl" type="text/html">
  	{{each list}}
  	<li class="mui-table-view-cell" data-link="{{$value['link']}}">
  		{{$value['title']}}
        <p>{{$value['desc']}}</p>
        <p>{{$value['pubDate']}}</p>
     </li>
     {{/each}}
  </script>
    
    <script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/template-web.js"></script>
    <script type="text/javascript">
    mui.init({
    	
    	pullRefresh:{
    		container:'#refreshContainer',
    		up:{
    			auto:true,
    			callback:getData
    		}
    	}});
    	var page=0;
    	function getData(){
    		if(page>=5){
    			mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
    		}
    		else{
    			mui.get('http://route.showapi.com/109-35',{
    			showapi_appid:37450,
    			showapi_sign:'289aa69d63ec42f99f8c147d3735a343',
    			maxResult:5,
    			page:page++,
    		},function(res){
	
    			//console.log(res);
    			if(res && res.showapi_res_code==0){
    				var list=res.showapi_res_body.pagebean.contentlist;
    				var tpl=template('tpl',{list:list});
    				document.getElementById('list').innerHTML +=tpl;
    			}
    			else{
    				mui.alert(res.showapi_res_error);
    			}
    			mui('#refreshContainer').pullRefresh().endPullupToRefresh();
    		},'json')
    		}
    	}
    	
    	
    	
    	mui('#list').on('tap','li',function(e){
    		
    		var link=this.getAttribute('data-link');
      		
      		mui.plusReady(function(){
      			var details=mui.preload({
    			url:'newsDetail.html',
    			id:'detail'
    		})
      			console.log(details)
      		
      		
    		
    		mui.fire(details,'ready',{
    			link:link
    		})
    		mui.openWindow({
    			url:'newsDetail.html',
    			id:'detail'
    		})
      		})
      			
			
    	})
    		
    	
    	
    </script>
</body>
</html>
